import 'package:flutter/material.dart';
import 'package:terminal_flutter_demo/font/CustomIcon.dart';
import 'package:terminal_flutter_demo/widgets/my_image.dart';
import 'package:terminal_flutter_demo/res/user_daata_list.dart';

class ListViewPage extends StatelessWidget {
  ListViewPage({super.key}) {}

  _onTap() {
    print('购物车 支付');
  }

  @override
  Widget build(BuildContext context) {
    return ListView(
      padding: const EdgeInsets.all(10),
      children: <Widget>[
        const Text('ListView'),
        // Container(
        //   height: 44,
        //   width: 200, // 在ListView中的Container设置width无效
        //   padding: EdgeInsets.all(10),
        //   decoration: BoxDecoration(color: Colors.red),
        //   child: Text('在ListView中的Container设置width无效'),
        // ),
        const Divider(),
        const ListTile(
          leading: Icon(
            Icons.home,
            color: Colors.green,
          ),
          title: Text('主页'),
        ),
        const Divider(),
        const ListTile(
          leading: Icon(
            CustomIcon.weixin,
            color: Colors.green,
          ),
          title: Text('微信'),
          subtitle: Text('聊天'),
        ),
        const Divider(),
        ListTile(
          leading: const Icon(
            CustomIcon.gouwuchekong,
            color: Colors.red,
          ),
          title: Text('购物车'),
          subtitle: Text('支付'),
          onTap: _onTap,
        ),
        const Divider(),
        const ListTile(
          leading: MyCircleImage.url(
              'https://cdn-file-ssl-wan.ludashi.com/wan/newswf/dlgglm/42dl.gif'),
          title: Text('动图'),
          trailing: MyImage.url(
              'https://cdn-file-ssl-wan.ludashi.com/wan/newswf/dlgglm/42dl.gif'),
        ),
      ],
    );
  }
}

// ignore: must_be_immutable
class ListViewResPage extends StatelessWidget {
  List _listData = [];

  ListViewResPage({super.key}) {
    _listData = userDataList;
  }

  List<Widget> _getListData() {
    // List<Widget> listTiles = [];
    // for (var i = 0; i < userDataList.length; i++) {
    //   var item = userDataList[i];
    //   print(i);
    //   print('${item['avatar_source']}');
    //   listTiles.add(ListTile(
    //     leading: Image.network('${item['avatar_source']}'),
    //     title: Text('${item['nickname']}'),
    //     subtitle: Text('${item['total_likes_count']}'),
    //   ));
    // }
    // return listTiles;

    return userDataList
        .map((item) => (ListTile(
              leading: Image.network('${item['avatar_source']}'),
              title: Text('${item['nickname']}'),
              subtitle: Text('${item['total_likes_count']}'),
            )))
        .toList();
  }

  @override
  Widget build(BuildContext context) {
    // return ListView(
    //   scrollDirection: Axis.vertical,
    //   children: _getListData(),
    // );
    // return ListView(
    //   scrollDirection: Axis.vertical,
    //   children: userDataList
    //     .map((item) => (ListTile(
    //           leading: Image.network('${item['avatar_source']}'),
    //           title: Text('${item['nickname']}'),
    //           subtitle: Text('${item['total_likes_count']}'),
    //         )))
    //     .toList(),
    // );
    return ListView.builder(
      itemCount: _listData.length,
      itemBuilder: (context, index) {
        var item = _listData[index];
        return ListTile(
          leading: Image.network('${item['avatar_source']}'),
          title: Text('${item['nickname']}'),
          subtitle: Text('${item['total_likes_count']}'),
        );
      },
    );
  }
}
